<!DOCTYPE html>
<html>
<head>
  <title>Kontra Test</title>
  <style>
    html, body {
      padding: 0;
      margin: 0;
    }
    canvas {
      background: #333;
    }
    /*.score {
      position: absolute;
      top: 5px;
      left: 480px;
      color: #FF7F00;
      font-family: Helvetica, sans-serif;
      cursor: default;
    }
    .game-over {
      position: absolute;
      top: 100px;
      left: 210px;
      color: #FF7F00;
      font-family: Helvetica, sans-serif;
      font-size: 30px;
      cursor: default;
      display: none;
    }
    .game-over span {
      font-size: 20px;
      cursor: pointer;
      position: relative;
      left: 50px;
    }
    .game-over span:hover {
      color: #FFD700;
    }
    .loading {
      position: absolute;
      top: 100px;
      left: 210px;
      color: #FF7F00;
      font-family: Helvetica, sans-serif;
      font-size: 30px;
      cursor: default;
    }*/

    #progress {
      position: relative;
      z-index: 1;
      text-align: center;
      height: 320px;
    }

    #progress:before,
    #progress:after {
      content: '';
      display: inline-block;
      height: 100%;
      vertical-align: middle;
    }

    .progress-wrapper {
      display: inline-block;
    }

    #play {
      visibility: hidden;
      line-height: 24px;
      margin-top: 5px;
      padding: 0 10px;
      border-radius: 5px;
      outline: 0;
    }
  </style>
  <script type="text/javascript" src="../../kontra.js"></script>

</head>
<body>
    <canvas id="game" width="600" height="360"></canvas>
    <p>M - Mute</p>
    <p>P - Pause</p>

  <!-- <div class="score">SCORE: <span id="score">0</span></div>
  <div class="game-over" id="game-over">GAME OVER<p><span onclick="startGame()">Restart</span></p></div>
  <div class="loading" id="loading">LOADING...<p>Please wait</p></div>
   -->
   <script>
    // must init kontra before we can load modules
    kontra.init();
    kontra.initKeys();
    kontra.initPointer();
  </script>
  <script src='js/index.js' type="module"></script>
</body>
</html>